<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <title>Form unit test</title>
        <style type="text/css">
            @import "../../../dojo/resources/dojo.css";
            @import "../css/dijitTests.css";
        </style>
        <!-- required: the default dijit theme: -->
        <link id="themeStyles" rel="stylesheet" href="../../../dijit/themes/claro/claro.css">
        <!-- required: dojo.js -->
        <script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug: true, parseOnLoad: true">
        </script>
        <!-- only needed for alternate theme testing: -->
        <script type="text/javascript" src="../_testCommon.js">
        </script>
        <script type="text/javascript">
            dojo.require("dojo.date");
            dojo.require("dijit.dijit"); // optimize: load dijit layer
            dojo.require("dijit.form.Form");
            dojo.require("dijit.form.ValidationTextBox");
            dojo.require("dijit.form.Button");

            function foo(isValid){
                var form = dijit.byId("myForm1");
                var btn = dijit.byId("submitBtn");
                btn.set("disabled", !isValid);
            }

            dojo.addOnLoad(function(){
                var form = dijit.byId("myForm1");
                dojo.connect(form, "onValidStateChange", null, foo);
                dijit.byId("submitBtn").set("disabled", true);
            })
        </script>
    </head>
    <body class="claro">
        <h1 class="testTitle">Form Widget Unit Test</h1>
        <form dojoType="dijit.form.Form" id="myForm1" onSubmit="dojo.stopEvent(arguments[0])">
            <h3>This form's submit button should become enabled ONLY when all fields are valid</h3>
            <p>
            	This is a test case for <a href="http://bugs.dojotoolkit.org/ticket/8966">#8966</a>.
            </p>
            <input dojoType="dijit.form.ValidationTextBox" required="true" name="field1" id="field1" />Foo*
            <br/>
            <input dojoType="dijit.form.ValidationTextBox" required="true" name="field2" id="field2" />Bar*
            <br/>
            <button dojoType="dijit.form.Button" id="submitBtn" type="submit">
                Submit
            </button>
			<br/><em>*Required</em>
        </form>
    </body>
</html>
